<template>
  <el-dialog
      :model-value="centerDialogVisible"
      title="练车预约"
      width="30%"
      center
      draggable
      @close="handleClose"
  >
    <div style="display: flex;align-items: center;justify-content: center">
      <span>
        选择预约期限：
      </span>
      <div>
        <el-date-picker
            v-model="datevalue"
            type="date"
            placeholder="选择日期"
            :disabled-date="disabledate"
            format="YYYY/MM/DD"
            value-format="YYYY-MM-DD"
        >
        </el-date-picker>
      </div>
    </div>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="handleClose">取消</el-button>
        <el-button type="primary" @click="submitYY">确定</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup>
import {ref} from "vue";
import {InsertOrderPractise} from "@/api/order_practise";
import {ElMessage} from "element-plus";

const props = defineProps({
  initplaceid:{
    type:String,
    required:true
  },
  initmyid:{
    type:String,
    required:true
  },
  refPlace:{
    type:Function,
    required:true
  }
})
const Emits=defineEmits(['update:modelValue'])

// 获取当前时间
const UpData=(myday)=>{
  const nowDate = new Date();
  const targetday = nowDate.getTime() + 1000 * 60 * 60 * 24 * myday
  nowDate.setTime(targetday)
  const date = {
    year: nowDate.getFullYear(),
    month: nowDate.getMonth() + 1,
    date: nowDate.getDate(),
  }
  const newmonth = date.month>10?date.month:'0'+date.month
  const day = date.date>10?date.date:'0'+date.date
  return  date.year + '-' + newmonth + '-' + day
}
const datevalue = ref(UpData(0))
//禁用日期
const disabledate = (date) =>{
  return new Date(date).getTime() < new Date(UpData(-1)).getTime()||new Date(date).getTime() > new Date(UpData(7)).getTime()
}

const handleClose=()=>{
  Emits('update:modelValue',false)
}

const submitYY = async () =>{
  await InsertOrderPractise({practiseId:props.initplaceid,userId:props.initmyid,time:datevalue.value,status:'1'}).then(res=>{
    if (res.code === 20011){
      ElMessage({
        message: '预约成功',
        type: 'success',
      })
    }else {
      ElMessage({
        message: '预约失败',
        type: 'error',
      })
    }
    props.refPlace()
  })
  handleClose()
}
</script>

<style scoped>

</style>